<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
  <head>
  	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  	<title>Scriptaculous Color Picker</title>
  	<link rel="stylesheet" href="picky_color.css" type="text/css" charset="utf-8">
  	<script src="prototype.js" type="text/javascript" charset="utf-8"></script>
  	<script src="effects.js" type="text/javascript" charset="utf-8"></script>
  	<script src="dragdrop.js" type="text/javascript" charset="utf-8"></script>
  	<script src="picky_color.js" type="text/javascript" charset="utf-8"></script>
  	<style type="text/css" media="screen">
  	  * { font-family: 'lucida grande', verdana, sans-serif; font-size: 95%; }
      #hex { float: left; }
      #colorWell { width: 50px; height: 20px; float: left; margin-left: 10px; cursor: pointer; }
  	</style>
  </head>
  <body>
    <input type="text" id="hex"> <span id="colorWell"></span>
    <script type="text/javascript" charset="utf-8">
      var Picky1 = new PickyColor({
        color: '6BA345',
        field: 'hex',
        colorWell: 'colorWell',
        draggable: true,
        closeText: 'DONE',
        imageBase: 'images/'
      })
      var Picky2 = new PickyColor({
        imageBase: 'images/'
      })
      Picky2.show()
    </script>
  </body>
</html>
